import { defineConfig } from 'unocss';

export default defineConfig({
	rules: [
		// 宽
		[/^w-([.\d]+)$/, ([_, num]) => ({ width: `${num}px` })],
		[/^max-w-([.\d]+)$/, ([_, num]) => ({ 'max-width': `${num}px` })],
		[/^min-w-([.\d]+)$/, ([_, num]) => ({ 'min-width': `${num}px` })],
		[/^w-per-([.\d]+)$/, ([_, num]) => ({ width: `${num}%` })],
		
		// 高
		[/^h-([.\d]+)$/, ([_, num]) => ({ height: `${num}px` })],
		[/^max-h-([.\d]+)$/, ([_, num]) => ({ 'max-height': `${num}px` })],
		[/^min-h-([.\d]+)$/, ([_, num]) => ({ 'min-height': `${num}px` })],
		[/^h-per-([.\d]+)$/, ([_, num]) => ({ height: `${num}%` })],

		// margin
		[/^m-([.\d]+)$/, ([_, num]) => ({ margin: `${num}px` })],
		[/^mt-([.\d]+)$/, ([_, num]) => ({ 'margin-top': `${num}px` })],
		[/^mb-([.\d]+)$/, ([_, num]) => ({ 'margin-bottom': `${num}px` })],
		[/^ml-([.\d]+)$/, ([_, num]) => ({ 'margin-left': `${num}px` })],
		[/^mr-([.\d]+)$/, ([_, num]) => ({ 'margin-right': `${num}px` })],

		// padding
		[/^p-([.\d]+)$/, ([_, num]) => ({ padding: `${num}px` })],
		[/^pt-([.\d]+)$/, ([_, num]) => ({ 'padding-top': `${num}px` })],
		[/^pb-([.\d]+)$/, ([_, num]) => ({ 'padding-bottom': `${num}px` })],
		[/^pl-([.\d]+)$/, ([_, num]) => ({ 'padding-left': `${num}px` })],
		[/^pr-([.\d]+)$/, ([_, num]) => ({ 'padding-right': `${num}px` })],

		// fontSize
		[/^text-([.\d]+)$/, ([_, num]) => ({ 'font-size': `${num}px` })],

		// 圆角
		[/^rouned-([.\d]+)$/, ([_, num]) => ({ 'border-radius': `${num}px` })],

		// 定位
		['relative', { position: 'relative' }],
		['absolute', { position: 'absolute' }],
		[/^t-([.\d]+)$/, ([_, num]) => ({ top: `${num}px` })],
		[/^b-([.\d]+)$/, ([_, num]) => ({ bottom: `${num}px` })],
		[/^l-([.\d]+)$/, ([_, num]) => ({ left: `${num}px` })],
		[/^r-([.\d]+)$/, ([_, num]) => ({ right: `${num}px` })],

		// 边框
		['border', { border: '1px solid #e4e5ea' }],
	]
});
